Ext.onReady(function(){
	Ext.QuickTips.init();

	// turn on validation errors beside the field globally
	Ext.form.Field.prototype.msgTarget = 'side';

//	Start of Display CarPool Form
	var displayCarPool = new Ext.FormPanel({
		frame:true,
		height:500,
		width:350,
		title: 'Car Pool',
		// bodyStyle:'padding:5px 5px 0',
		fieldDefaults: {
		msgTarget: 'side'
	},
	defaultType: 'displayfield',


	items :[{
		fieldLabel: 'POOL ID',
		name: 'first',
		allowBlank:false,
		value:'1002'
	},{
		fieldLabel: 'Provider NAME',
		name: 'last',
		value:'Praveen Parsa'
	},{
		fieldLabel: 'SOURCE',
		name: 'source',
		value:'MehdiPatnam'

	}, {
		fieldLabel: 'DESTINATION',
		name: 'destination',
		value:'PatniPatnam'
	},
	{
		fieldLabel: 'START TIME',
		name: 'starttime',
		value:'8:00 AM'
	},
	{
		fieldLabel: 'END TIME',
		name: 'endtime',
		value:'6:00 PM'
	},{
		xtype:'fieldset',
		title: 'Rider Details',
		collapsible: false,
		defaultType: 'textfield',
		// layout: 'anchor',
		defaults: {
		anchor: '100%'
	},
	items :[{
		fieldLabel: 'Rider Name',
		name: 'rname',
		value: 'Samrat'
	},{
		fieldLabel: 'Rider Name',
		name: 'mobile',
		value:'Praveen'
	}]
	}
	],

    buttons: [{
    	text: 'Cancel',
    	handler: function(){
    	win.hide();
    }}]
	});

//	End of Display CarPool

//	Start Of Edit CarPool



	var editCarpool = new Ext.FormPanel({
		labelWidth: 75, // label settings here cascade unless overridden
		url:'save-form.php',
		frame:true,
		title: 'Edit Carpool',
		bodyStyle:'padding:5px 5px 0',
		width: 350,
		height:500,
		defaults: {width:230},
		defaultType: 'textfield',
		monitorValid:true,
		items: [/*{
	                xtype: 'combo',
	                name: 'serviceType',
	                fieldLabel:'Service Type',
	                mode:'local',
	                store: types ,
	                displayField:'type',
	                allowBlank:false,
	                width: 80
	            },*/
		        {
		        	xtype: 'displayfield',
		        	fieldLabel: 'Service Type',
		        	value: 'Provider'
		        },{
		        	fieldLabel: 'Car Name',
		        	name: 'carName',
		        	allowBlank:false
		        	//width: 80
		        },{
		        	xtype: 'textfield',
		        	fieldLabel: 'NO of Seats Availble',
		        	name: 'noSeats',
		        	allowBlank:false,
		        	length:2,
		        	width: 40
		        },{
		        	fieldLabel: 'Originating Point',
		        	name: 'source',
		        	allowBlank:false,
		        	width: 80
		        },{
		        	fieldLabel: 'Destination Point',
		        	name: 'destination',
		        	allowBlank:false,
		        	width: 80
		        },{
		        	fieldLabel: 'Route',
		        	name: 'Route',
		        	allowBlank:false
		        	// width: 120
		        },{
		        	xtype:'button',
		        	text: 'Add Route',
		        	width:100,
		        	handler: function() {
		        	var p = editCarpool.items.length - 4;
		        	//alert("Hi ra"+p);
		        	simple.insert(p, {
		        		xtype: 'textfield'
		        			//fieldLabel: 'Added field' 
		        	});
		        	simple.doLayout();
		        }
		        }, {
		        	xtype: 'timefield',
		        	fieldLabel: 'Start Time',
		        	name: 'startTime',
		        	allowBlank:false,
		        	width: 80
		        }, {
		        	xtype: 'timefield',
		        	fieldLabel: 'Return Time',
		        	name: 'returnTime',
		        	allowBlank:false,
		        	width: 80
		        },{
		        	xtype: 'textarea',
		        	fieldLabel: 'Description',
		        	name: 'description',
		        	allowBlank:false
		        	//width: 80
		        }

		        ],

		        buttons: [{
		        	text: 'Save',
		        	formBind: true,
		        	handler: function(){
		           Ext.Msg.alert("Successful","Details Edited Successfuly");
		           win.hide();
		        }
		        },{
		        	text: 'Cancel',
		        	handler: function(){
		        	win.hide();
		        }}]
	});
//	End Of Edit Carpool


//	Start Of Add CarPool

	var types = new Ext.data.SimpleStore({
		fields:['type'],
		data:[['Provider'],['Rider']]
	});

	var addCarPool = new Ext.FormPanel({
		labelWidth: 75, // label settings here cascade unless overridden
		url:'save-form.php',
		frame:true,
		title: 'Create Carpool',
		bodyStyle:'padding:5px 5px 0',
		width: 350,
		height:500,
		defaults: {width:230},
		defaultType: 'textfield',
		monitorValid:true,
		items: [/*{
	                xtype: 'combo',
	                name: 'serviceType',
	                fieldLabel:'Service Type',
	                mode:'local',
	                store: types ,
	                displayField:'type',
	                allowBlank:false,
	                width: 80
	            },*/
		        {
		        	xtype: 'displayfield',
		        	fieldLabel: 'Service Type',
		        	value: 'Provider'
		        },{
		        	fieldLabel: 'Car Name',
		        	name: 'carName',
		        	allowBlank:false
		        	//width: 80
		        },{
		        	xtype: 'textfield',
		        	fieldLabel: 'NO of Seats Availble',
		        	name: 'noSeats',
		        	allowBlank:false,
		        	length:2,
		        	width: 40
		        },{
		        	fieldLabel: 'Originating Point',
		        	name: 'source',
		        	allowBlank:false,
		        	width: 80
		        },{
		        	fieldLabel: 'Destination Point',
		        	name: 'destination',
		        	allowBlank:false,
		        	width: 80
		        },{
		        	fieldLabel: 'Route',
		        	name: 'Route',
		        	allowBlank:false
		        	// width: 120
		        },{
		        	xtype:'button',
		        	text: 'Add Route',
		        	width:100,
		        	handler: function() {
		        	var p = simple.items.length - 4;
		        	alert("Hi ra"+p);
		        	simple.insert(p, {
		        		xtype: 'textfield'
		        			//fieldLabel: 'Added field' 
		        	});
		        	simple.doLayout();
		        }
		        }, {
		        	xtype: 'timefield',
		        	fieldLabel: 'Start Time',
		        	name: 'startTime',
		        	allowBlank:false,
		        	width: 80
		        }, {
		        	xtype: 'timefield',
		        	fieldLabel: 'Return Time',
		        	name: 'returnTime',
		        	allowBlank:false,
		        	width: 80
		        },{
		        	xtype: 'textarea',
		        	fieldLabel: 'Description',
		        	name: 'description',
		        	allowBlank:false
		        	//width: 80
		        }

		        ],

		        buttons: [{
		        	text: 'Save',
		        	formBind: true	
		        },{
		        	text: 'Cancel',
		        	handler: function(){
		        	win.hide();
		        }}]
	});

//	End Of Add CarPoll
	/*   Main Form*/
	var win;
	var mainForm = new Ext.FormPanel({
		frame:true,
		title: 'Mange Your Car Pool',
		bodyStyle:'padding:5px 5px 0;align: center',
		fieldDefaults: {
		msgTarget: 'side'
	},
	defaultType: 'displayfield',
	buttonAlign: 'center',
	buttons:[{
		text:"Add CarPool",
		height:100,
		handler: function() {
		//alert("hi");
		win = new Ext.Window({
			layout:'fit',
			model: true ,
			title:'Welcome To Vcarpool',
			closable: false,
			resizable: false,
			width: 400,
			height:500,
			plain: true,
			border: false,
			items: [addCarPool]                
		});
		win.show();

	}
	},{
		text: 'View CarPool',
		height:100,
		handler:function() {

		win = new Ext.Window({
			layout:'fit',
			model: true ,
			title:'Welcome To Vcarpool',
			closable: false,
			resizable: false,
			width: 400,
			height:500,
			plain: true,
			border: false,
			items: [displayCarPool]                
		});
		win.show();
	}
	},{
		text: 'Edit CarPool',
		height:100,
		handler:function(){
		win = new Ext.Window({
			layout:'fit',
			model: true ,
			title:'Welcome To Vcarpool',
			closable: false,
			resizable: false,
			width: 400,
			height:500,
			plain: true,
			border: false,
			items: [editCarpool]                
		});
		win.show();
	}
	}]
	});

	mainForm.render('right');

});
